import { Card, message, Row, Col, Space } from 'antd';
import { history } from 'umi';
import ProForm, { ProFormSelect, ProFormText, ProFormUploadButton } from '@ant-design/pro-form';
import { useRequest } from 'umi';
import type { FC } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { fakeSubmitForm, queryDetail, update, list } from './service';
import {
    queryDictList,
    hospitalDeptlist,
    queryDiseaseClassList,
    getBsPathologType,
} from '@/services/ant-design-pro/api';

const BasicForm: FC<Record<string, any>> = () => {
    const { run } = useRequest(fakeSubmitForm, {
        manual: true,
        onSuccess: () => {
            message.success('提交成功');
        },
    });

    // const { data, loading } = useRequest(() => {
    //   if (history.location.query.id) {
    //     return queryDetail(history.location.query);
    //   }
    // });

    const onFinish = async (values: Record<string, any>) => {
        values.icon = values.upload[0].response.data.url;

        let classRelations = [];
        for (var i = 0; i < values.classRelations.length; i++) {
            let item = {};
            item.itemId = values.classRelations[i].value;
            item.itemName = values.classRelations[i].label;
            classRelations.push(item);
        }
        values.classRelations = classRelations;

        let pathologDiseaseRelations = [];
        for (var i = 0; i < values.pathologDiseaseRelations.length; i++) {
            let item = {};
            item.itemId = values.pathologDiseaseRelations[i].value;
            item.itemName = values.pathologDiseaseRelations[i].label;
            pathologDiseaseRelations.push(item);
        }
        values.pathologDiseaseRelations = pathologDiseaseRelations;

        let deptDiseaseTagsRelations = [];
        for (var i = 0; i < values.deptDiseaseTagsRelations.length; i++) {
            let item = {};
            item.itemId = values.deptDiseaseTagsRelations[i].value;
            item.itemName = values.deptDiseaseTagsRelations[i].label;
            deptDiseaseTagsRelations.push(item);
        }
        values.deptDiseaseTagsRelations = deptDiseaseTagsRelations;
        console.log('values', values);
        if (history.location.query.id) {
            values.id = history.location.query.id;
            try {
                const response = await update(values);
                if (response.code == 200) {
                    message.success('修改成功');
                } else {
                    message.error('修改失败!');
                }
            } catch (error) {
                console.log(error);
            }
        } else {
            run(values);
        }
    };

    const formItemLayout = {
        labelCol: { span: 4 },
        wrapperCol: { span: 14 },
    };

    return (
        <PageContainer content="">
            <Card bordered={false}>
                <ProForm
                    hideRequiredMark
                    style={{ margin: 'auto', marginTop: 8 }}
                    name="basic"
                    layout="horizontal"
                    // initialValues={data}
                    onFinish={onFinish}
                    {...formItemLayout}
                    request={async () => {
                        if (history.location.query.id) {
                            return queryDetail(history.location.query).then(({ data }) => {
                                // let diseaseIds = [];
                                // for (var i = 0; i < data.diseaseRelationList.length; i++) {
                                //   diseaseIds.push(data.diseaseRelationList[i].diseaseId);
                                // }
                                // data.diseaseIds = diseaseIds;
                                if (data.icon) {
                                    data.upload = [
                                        {
                                            uid: '1',
                                            name: 'icon',
                                            status: 'done',
                                            url: data.icon,
                                        },
                                    ];
                                }
                                data.level = data.level + '';
                                let deptDiseaseTagsRelations = [];
                                for (var i = 0; i < data.deptDiseaseTagsRelations.length; i++) {
                                    let item = {};
                                    item.value = data.deptDiseaseTagsRelations[i].itemId;
                                    item.label = data.deptDiseaseTagsRelations[i].itemName;
                                    deptDiseaseTagsRelations.push(item);
                                }
                                data.deptDiseaseTagsRelations = deptDiseaseTagsRelations;
                                let classRelations = [];
                                for (var i = 0; i < data.classRelations.length; i++) {
                                    let item = {};
                                    item.value = data.classRelations[i].itemId;
                                    item.label = data.classRelations[i].itemName;
                                    classRelations.push(item);
                                }
                                data.classRelations = classRelations;
                                console.log('data', data);
                                return data;
                            });
                        } else {
                            return {};
                        }
                    }}
                    submitter={{
                        render: (props, doms) => {
                            return (
                                <Row>
                                    <Col span={14} offset={4}>
                                        <Space>{doms}</Space>
                                    </Col>
                                </Row>
                            );
                        },
                    }}
                >
                    <ProFormText
                        width="md"
                        label="疾病名称"
                        name="name"
                        rules={[
                            {
                                required: true,
                                message: '请输入疾病名称',
                            },
                        ]}
                        placeholder="请输入疾病名称"
                    />
                    <ProFormSelect
                        width="md"
                        name="level"
                        label="疾病等级"
                        valueEnum={{
                            1: '一级',
                            2: '二级',
                        }}
                    />
                    <ProFormSelect
                        width="md"
                        name="parentId"
                        label="上级疾病"
                        showSearch
                        request={async ({ keyWords }) => {
                            let query = {
                                likeQuery: {
                                    name: keyWords,
                                },
                                eqQuery: {
                                    level: 1,
                                },
                                pageNum: 1,
                                pageSize: 20,
                            };
                            return list(query).then(({ data }) => {
                                return data.list.map((item) => {
                                    return {
                                        label: item.name,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                    />
                    <ProFormSelect
                        width="md"
                        name="bodyId"
                        label="疾病部位"
                        request={async () => {
                            const params = { dictCode: 'bodyParts' };
                            return queryDictList(params).then(({ data }) => {
                                return data.map((item) => {
                                    return {
                                        label: item.itemName,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                    />
                    <ProFormSelect
                        width="md"
                        name="deptDiseaseTagsRelations"
                        label="就诊科室"
                        showSearch
                        fieldProps={{
                            mode: 'multiple',
                            labelInValue: true,
                        }}
                        request={async ({ keyWords }) => {
                            let query = {
                                likeQuery: {
                                    bsDeptName: keyWords,
                                },
                                pageNum: 1,
                                pageSize: 20,
                            };
                            return hospitalDeptlist(query).then(({ data }) => {
                                return data.list.map((item) => {
                                    return {
                                        label: item.name,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                    />
                    <ProFormSelect
                        width="md"
                        name="pathologDiseaseRelations"
                        label="病例分型"
                        fieldProps={{
                            mode: 'multiple',
                            labelInValue: true,
                        }}
                        showSearch
                        request={async ({ keyWords }) => {
                            let query = {
                                likeQuery: {
                                    pathologName: keyWords,
                                },
                                pageNum: 1,
                                pageSize: 20,
                            };
                            return getBsPathologType(query).then(({ data }) => {
                                console.log('data', data);
                                return data.list.map((item) => {
                                    return {
                                        label: item.pathologName,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                    />
                    <ProFormSelect
                        width="md"
                        name="classRelations"
                        label="疾病分类"
                        fieldProps={{
                            mode: 'multiple',
                            labelInValue: true,
                        }}
                        request={async ({ keyWords }) => {
                            let query = {
                                likeQuery: {
                                    className: keyWords,
                                },
                                pageNum: 1,
                                pageSize: 20,
                            };
                            return queryDiseaseClassList(query).then(({ data }) => {
                                return data.list.map((item) => {
                                    return {
                                        label: item.className,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                    />
                    <ProFormUploadButton
                        name="upload"
                        label="疾病LOGO"
                        max={1}
                        fieldProps={{
                            name: 'file',
                            listType: 'picture-card',
                        }}
                        action="/api/file/upload"
                    />
                </ProForm>
            </Card>
        </PageContainer>
    );
};

export default BasicForm;
